<script setup>
import { ref, onMounted } from 'vue'
import { RoleApi } from '@/api/role/index.js'

const props =  defineProps({
  roleIds: {
    type: Array,
    default: () => []
  }
})

const roles = ref([])

const rolesData = ref([
  {
    name: '普通用户',
    code: 'USER',
    id: '0'
  }
])

onMounted(() => {
  RoleApi.list().then(res => {
    console.log('rolesData', res)
    rolesData.value = res.data
  })
  roles.value = props.roleIds
})
</script>

<template>
  <el-select v-if="rolesData" multiple v-model="roles" placeholder="请选择角色">
    <el-option v-for="item in rolesData" :key="item.id" :label="item.name" :value="item.id"></el-option>
  </el-select>
</template>

<style scoped>

</style>